import { Card as SemiCard, Button, ButtonGroup, List } from "@douyinfe/semi-ui";
import { IconRefresh, IconPlusCircle, IconUpload, IconEdit, IconDelete, IconEyeOpened, IconSave, IconReply } from "@douyinfe/semi-icons";
import { Popconfirm, Card, Space, Avatar, Row, Col, Image, Tag, Modal, message, Form, Input, Descriptions } from "antd";
import { v4 as uuidv4 } from "uuid";
import { useModel, useOutletContext, history } from "umi";
import { useReactive } from "ahooks";
import { useState, useEffect } from "react";
import React from "react";
import { format } from "timeago.js";

const MiniappInfoPage = () => {
    const { selectItem, cardBodyHeight } = useOutletContext();
    const { UTCTimeToLocal } = useModel("global");
    const [form] = Form.useForm();

    const state = useReactive({
        loading: false,
        appitems: [
            {
                key: "3",
                label: "secret",
                children: "Cloud Database",
                span: 3,
            },
            {
                key: "4",
                label: "AppID",
                children: "Cloud Database",
                span: 3,
            },
            {
                key: "5",
                label: "Gateway",
                children: "Cloud Database",
                span: 3,
            },
        ],
    });

    return (
        <div style={{ padding: 20 }}>
            <Descriptions bordered items={state.appitems}></Descriptions>
        </div>
    );
};

export default MiniappInfoPage;
